import Vue from 'vue'
import VueRouter from 'vue-router'
import HomeView from '../views/HomeView.vue'

Vue.use(VueRouter)

const routes = [
  { 
    path: '/article',
    name: 'article',
    component: () => import('../views/Article.vue') 
  },
  { 
    path: '/inf',
    name: 'inf',
    component: () => import('../testing/Inf.vue') 
  },
  { 
    path: '/swipe',
    name: 'swipe',
    component: () => import('../testing/Swipe.vue') 
  },
  { 
    path: '/tabbar',
    name: 'tabbar',
    component: () => import('../testing/Tabbar.vue') 
  },
  { 
    path: '/nav',
    name: 'nav',
    component: () => import('../testing/Nav.vue') 
  },
  {
    path: '/login',
    name: 'login',
    component: () => import('../views/Login.vue') 
  },
  {
    path: '/register',
    name: 'register',
    component: () => import('../views/Register.vue') 
  },
  {
    path: '/field',
    name: 'Field',
    component: () => import('../testing/Field.vue') 
  },
  {
    path: '/header',
    name: 'header',
    component: () => import('../testing/Header.vue') 
  },
  {
    path: '/button',
    name: 'button',
    component: () => import('../testing/Button.vue') 
  },

  {
    path: '/',
    redirect: '/home/index'
  },
  {
    path: '/home',
    name: 'home',
    component: HomeView,
    children: [
      {
        path: 'index',
        component: () => import('../views/Index.vue'),
        meta: {
          keepAlive: true
        }
      },
      {
        path: 'me',
        component: () => import('../views/Me.vue')                            
      }
    ]
  },
  {
    path: '/about',
    name: 'about',
    component: () => import('../views/AboutView.vue')
  }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes,
  scrollBehavior(to, from, savedPosition){
    // 该方法当切换路由时，将自动调用, 例如A路由跳转到B路由时将自动执行
    // to: 返回B路由对象
    // from: 返回A路由对象
    // savedPosition: 保存的目标路由的历史滚动位置
    // console.log('to', to)
    // console.log('from', from)
    // console.log('savedPosition', savedPosition)
    
    if(from.path=='/home/index' && to.path=='/home/index'){
      // 捕获到了首页刷新操作  从首页跳到首页
      return {x: 0, y: 0}
    }
    return savedPosition
  }
})

export default router
